/*
 * 整体妆容列表搜索
 * @Author: ljb
 * @Date: 2018-05-22 15:14:34
 * @Last Modified by: kanglin
 * @Last Modified time: 2018-08-07 17:53:07
 */
<template>
	<Form
		ref="formInline"
		inline
		@keydown.native.enter.prevent="confirmSearch">

		<Form-item
			:label-width="100"
			:label="$t('overall.name')">
			<i-input
				v-model="formValidate.name"
				:placeholder="$t('overall.please_enter_name')"
				name="query__name"/>
		</Form-item>

		<Form-item
			:label-width="100"
			:label="$t('overall.status')">
			<Select
				v-model="formValidate.is_deleted"
				clearable
				name="query__status"
				filterable>
				<Option
					v-for="option in status_options"
					:value="option.value"
					:key="option.value">{{ option.label }}</Option>
			</Select>
		</Form-item>

		<Form-item
			:label-width="100"
			:label="$t('overall.category_name')">
			<Select
				v-model="formValidate.category_id"
				clearable
				filterable>
				<Option
					v-for="(value,key) in classifyList"
					:value="String(value.id)"
					:key="key">{{ value.name }}</Option>
			</Select>
		</Form-item>

		<Form-item>
			<Button
				type="primary"
				name="query__submit"
				@click="confirmSearch">
				{{ this.$t('common.search') }}
			</Button>
		</Form-item>

	</Form>
</template>
<script>

export default {
	name: 'OverallMakeupSearchForm',
	props: {
		classifyList: {
			type: Array,
			default() {
				return [];
			},
		},
	},
	data() {
		return {

			status_options: [
				{
					value: '0',
					label: this.$t('overall.using'), // '使用中',
				},
				{
					value: '1',
					label: this.$t('overall.off_sale'), // '下架了',
				},
			],

			formValidate: {
				name: '', // 妆容名称
				is_deleted: '', // 使用状态
				category_id: '', // 类型名称
			},

		};
	},
	methods: {

		/**
         * 确认搜索
         * @return {undefined}
         */
		confirmSearch() {
			this.$emit('search', this.formValidate);
		},

	},

};

</script>
